<template>
  <groupTable
    :data="data"
    :config="config"
    :pageParams="pageParams"
    id="printTable"
  >
    <span slot="menuLeft"> </span>
  </groupTable>
</template>

<script>
import groupTable from "@/components/groupTable/index.vue";
export default {
  components: { groupTable },
  data() {
    return {
      data: {},
      pageParams: {
        background: false, // 分页是否需要背景色
        pageSize: 10,
        pagerCount: 5,
        currentPage: 1,
      },
      config: {
        sortable: true,
        dragGroup: true,
        printBtn: true,
        viewBtn: true,
        // dialogType: 'drawer',
        column: [
          {
            label: "编号",
            prop: "number",
            search: true, // 表示该列既是表格列,又是搜索列
          },
          {
            label: "姓名",
            prop: "name",
            // search: true,
          },
          {
            label: "电话",
            prop: "phone",
            // search: true,
          },
          {
            label: "住址",
            prop: "address",
            // search: true,
            overHidden: true, // 内容过长时隐藏并显示tooltip
          },
          {
            label: "简介",
            prop: "introduction",
            overHidden: true, // 内容过长时隐藏并显示tooltip
          },

          {
            label: "备注",
            prop: "remark",
          },
          {
            label: "字典",
            prop: "select",
            type: "select",
            formatter: (val, value, label) => {
              // 字典对应的对象  value值  label值
              return `${label}(${value})`;
            },
            props: {
              label: "name",
              value: "code",
            },
            dicUrl: "https://cli.avuejs.com/api/area/getProvince",
          },
        ],
      },
    };
  },
  created() {
    this.getDataList();
  },
  methods: {
    // 获取表格数据
    getDataList() {
      axios.post("/table/list").then((res) => {
        this.data = {
          list: res.data.rows,
          total: res.data.total,
        };
        for (let i = 0; i < this.data.list.length; i++) {
          if (i % 2) {
            this.data.list[i].remark = "是";
            this.data.list[i].select = "130000";
          } else {
            this.data.list[i].remark = "否";
            this.data.list[i].select = "110000";
          }
        }
      });
    },
  },
};
</script>

<style>
</style>